<?php require VIEWPATH. ADMIN_DIR. DIRECTORY_SEPARATOR. 'header.php'?>
<style type="text/css">

</style>
<div class="page-header">
	<h1>
		班级主题管理
		<span class="dropdown dropdown-custom">
			<div class="btn btn-info btn-dropdown"  data-toggle="dropdown">
				<i class="ace-icon fa fa-plus"></i> 发布主题&nbsp;&nbsp;<i class="ace-icon fa fa-caret-down"></i>
			</div>
			<ul class="dropdown-menu">
				<li>
					<a href="<?=admin_url('contents/subject_content_edit?type=' . SUBJECT_CONTENT_TYPE_IMAGE_AND_TEXT)?>">
						<i class="ace-icon fa fa-photo"></i> 发布图文主题
					</a>
				</li>
				<li>
					<a href="<?=admin_url('contents/subject_content_edit?type=' . SUBJECT_CONTENT_TYPE_VIDEO)?>">
						<i class="ace-icon fa fa-video-camera"></i> 发布视频主题
					</a>
				</li>
			</ul>
		</span>
	</h1>
</div>
<div class="col-xs-12 content-filter">
	<div class="widget-box">
		<div class="widget-header" style="vertical-align:middle;">
			<h4 class="widget-title">
				内容筛选
			</h4>
			<div class="widget-toolbar">
				<a href="#" data-action="collapse">
					<i class="ace-icon fa fa-chevron-up"></i>
				</a>
				<a href="#" data-action="close">
					<i class="ace-icon fa fa-times"></i>
				</a>
			</div>
		</div>
		<div class="widget-body">
			<div class="widget-main">
				<div class="form-inline keyword-search-div">
					<label class="keyword-search-label">标题&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
					<div class="keyword-search-box">
						<div class="div-search">
							<input style="float:left;height:30px;width:220px;border:1px solid #669FC7;padding:0 30px 0 14px;border-radius:10px 0 0 10px !important;-moz-border-radius:10px 0 0 10px;" type="text" name="title" placeholder="搜索标题..." autocomplete="off">
							<span id="empty-search" style="position:relative;right:64px;cursor:pointer;display:none;">×</span>
							<button id="btn-search" class="btn-search" style="outline:none;float:left;height:30px;width:44px;border:1px solid #669FC7;background-color:#669FC7;border:0;border-radius:0 10px 10px 0;-moz-border-radius:0 10px 10px 0;">
								<i class="ace-icon fa fa-search nav-search-icon white"></i>
							</button>
						</div>
					</div>
				</div>
				<!-- 管理员权限 -->
				<?php if($rmxUser['user_type'] == USER_TYPE_SCHOOL): ?>
					<div class="form-inline keyword-search-div">
						<label class="keyword-search-label">年级&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
						<div class="keyword-search-box">
							<a href="javascript:;" class="keyword-search-keyword keyword-search-grade active" data-id="0">全部</a>
							<?php foreach($gradeList as $grade): ?>
								<a href="javascript:;" class="keyword-search-keyword keyword-search-grade" data-id="<?=$grade['id']?>"><?=$grade['grade_name']?></a>
							<?php endforeach; ?>
						</div>
					</div>
					<div class="form-inline keyword-search-div">
						<label class="keyword-search-label">班级&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
						<div class="keyword-search-box div-classes">
							<a href="javascript:;" class="keyword-search-keyword keyword-search-class active" data-id="0">全部</a>	
						</div>
					</div>
				<?php else: ?>	
				<!-- 教师权限 -->
					<div class="form-inline keyword-search-div">
						<label class="keyword-search-label">班级&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
						<div class="keyword-search-box div-classes">
							<a href="javascript:;" class="keyword-search-keyword keyword-search-class active" data-id="0">全部</a>
							<?php foreach($rmxUser['classArr'] as $class): ?>
								<a href="javascript:;" class="keyword-search-keyword keyword-search-class" data-id="<?=$class['id']?>"><?=$class['name']?></a>
							<?php endforeach; ?>
						</div>
					</div>
				<?php endif ?>
				<div class="form-inline keyword-search-div">
					<label class="keyword-search-label">主题状态</label>
					<div class="keyword-search-box" id="div-effect">
						<a href="javascript:;" class="keyword-search-keyword active" data-value="0">全部</a>
						<a href="javascript:;" class="keyword-search-keyword" data-value="1">生效</a>
						<a href="javascript:;" class="keyword-search-keyword" data-value="2">失效</a>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<div class="col-xs-12">
	<table id="dynamic-table" class="table table-striped table-bordered table-hover" style="margin-top:10px">
		<thead>
			<tr>
				<th>主题标题</th>
				<th>主题发送班级</th>
				<th>类型</th>
				<th>在上课模式显示</th>
				<th>主题状态</th>
				<th>生效时间</th>
				<th>失效时间</th>
				<th>创建时间</th>
				<th>修改时间</th>
				<th>操作</th>
			</tr>
		</thead>
		<tbody>
		</tbody>
	</table>
</div>

<?php require VIEWPATH. ADMIN_DIR. DIRECTORY_SEPARATOR. 'footer.php'?>
<script type="text/javascript">
	// 班级数据
	var classJson = <?= $classList ?>;
	$(function(){
		// 主题表格
		var table = $('#dynamic-table').dt({
			"ajaxUrl": '<?=admin_url('contents/get_subject_content_list')?>',
			"columns": [
	            {"data": "title"},
	            {"data": function(ret){
	            	var html = "";
	            	for(var i in ret.classList) html += '<span class="label label-success mr10">'+ ret.classList[i]['class_name'] +'</span>';
	            	return html;
				}},
	            {"data": function(ret){
	            	if(ret.type == "<?= SUBJECT_CONTENT_TYPE_IMAGE_AND_TEXT ?>") {
						return '图文';
					} else {
						return '视频';
					}
				}},
				{"data": function(ret){
	            	if(ret.play_in_class_mode == 1) {
						return '是';
					} else {
						return '否';
					}
				}},
				{"data": function(ret){
	            	if(ret.isEffect) {
						return '<span class="label label-success">生效</span>';
					} else {
						return '<span class="label label-danger">失效</span>';
					}
				}},
				{"data": "begintime"},
	            {"data": "endtime"},
	            {"data": "createtime"},
	            {"data": "updatetime"},
	            {"data": function(ret){
					var action = '';
					// 如果是教师权限，只有任课班级的才能修改或删除
					// if(ret.role_change) {
						action += '<a class="green" href="<?=admin_url('contents/subject_content_edit')?>/'+ ret.id +'?type=' + ret.type + '"><i class="fa fa-edit"></i> 编辑</a>';
						action += '&nbsp;&nbsp;&nbsp;&nbsp;<a class="text-danger delete-subject-content" href="javascript:" data-id=' + ret.id +  ' data-title=' + ret.title + '><i class="fa fa-times"></i> 删除</a>';
					// }
					return action;
	            }},
			]
		});
		// 点击关键字
		$("body").on("click", ".keyword-search-keyword", function(){
			var id = $(this).data("id");
			// 高亮当前点击对象
			$(this).parent().find(".keyword-search-keyword").removeClass("active");
			$(this).addClass("active");
			// 如果是点击年级
			if($(this).hasClass("keyword-search-grade")) {
				// 获取班级列表
				$(".keyword-search-class:gt(0)").remove();
				var classList = classJson[id];
				for(var i in classList) $(".keyword-search-class:first").parent().append('<a href="javascript:;" class="keyword-search-keyword keyword-search-class" data-id="'+ classList[i].id +'">'+ classList[i].name +'</a>');
				// 点击班级筛选
				$(".keyword-search-class:first").trigger("click");
			} else {
				var title = $("[name=title]").val();
				var effect = $("#div-effect .active").data("value");
				// 筛选班级
				table.setAjaxData({
					"class_id": id,
					'title': title,
					"effect": effect
				});
			}
		});
		// 敲回车就搜索
		$("[name=title]").keypress(function (e) {
                if (e.which == 13) {
                    $("#btn-search").trigger("click");
                }
		});
		// 清空搜索框
		$("[name=title]").keyup(function() {
			if($(this).val().length > 0) {
				$("#empty-search").show();
				$("#empty-search").click(function(){
					$("[name=title]").val('');
					$(this).hide();
					// 重置搜索结果
					var classId = $(".div-classes > .active").data("id");
					var effect = $("#div-effect .active").data("value");
					table.setAjaxData({
						"class_id": classId,
						"effect": effect
					});
				})
			} else {
				$("#empty-search").hide();
			}
		});
		// 搜索标题
		$("#btn-search").click(function() {
			var title = $("[name=title]").val();
			var classId = $(".div-classes > .active").data("id");
			var effect = $("#div-effect .active").data("value");
			if(title != '') {
				table.setAjaxData({
					"class_id": classId,
					'title': title,
					"effect": effect
				})
			} else {
				table.setAjaxData({
					"class_id": classId,
					"effect": effect
				})
			}
		});
		// 删除主题
		$("body").on('click', '.delete-subject-content', function() {
			var id = $(this).data('id');
			var title = $(this).data('title');
			var posturl = "<?= admin_url("contents/delete_subject_content_action") ?>";
			var data = {
				'id': id
			};
			layer.confirm('确定删除：' + title + '？', { title:"提示", offset: '160px' }, function(){
				ajax_post(posturl, data, function() {
					// 刷新页面
					window.location.href = "<?= admin_url('contents/subject_content') ?>";
				});
			});
		});

		// 全选复选款
		$("#check-first").change(function(e) { 
			var checked =  $("#check-first").is(':checked'); 
			if(checked){
				$('.check-list').each(function (i){
					$(this).prop('checked', true);
				})
			} else{
				$('.check-list').each(function (i){
					$(this).prop('checked', false);
				})
			}
		});
		setTimeout(() => {
			$(".check-list").change(function(e) { 
				var checked = $(this).is(':checked');
				if(checked) {
					var allChecked = true;
					$('.check-list').each(function (i){
						if(!$(this).is(':checked')) {
							allChecked = false;
						}
					})
					if(allChecked) {
						$("#check-first").prop('checked', true);
					} else {
						$("#check-first").prop('checked', false);
					}
				} else {
					$("#check-first").prop('checked', false);
				}
			});
		}, 500);
		setTimeout(() => {
			$(".check-list").change(function(e) { 
				var checked = $(this).is(':checked');
				if(checked) {
					var allChecked = true;
					$('.check-list').each(function (i){
						if(!$(this).is(':checked')) {
							allChecked = false;
						}
					})
					if(allChecked) {
						$("#check-first").prop('checked', true);
					} else {
						$("#check-first").prop('checked', false);
					}
				} else {
					$("#check-first").prop('checked', false);
				}
			});
		}, 2000);

	})
</script>